import TypeCount from "@/components/TypeCount";
import Title from "../../components/title";
import "./index.less";
import IndicatorPercent from "@/components/IndicatorPercent";
import NumberBox from "@/components/NumberBox";

const L_1_box = (props: any) => {
  return (
    <div>
      <Title title={"景区人数 ( 今日 )"} />
      <div className="box_content  ">
        <div className="l1-bg">
          <div className="flex justify-between  h-[80px] pt-[10px]">
            <div className=" ">
              <div className="font16 pl-[5px]">景区名称</div>
              <div className="flex items-baseline justify-between  gap-[10px]">
                <TypeCount
                  title=""
                  size="small"
                  color="#12FFFC"
                  value="5151"
                  unit="家"
                />{" "}
                <IndicatorPercent title="同比" size="small" value="21.2" />
              </div>
            </div>
            <div>
              <div className="font14 pl-[15px]">景区名称</div>
              <div className="flex items-baseline justify-between  gap-[10px]">
                <TypeCount
                  title=""
                  size="small"
                  color="#12FFFC"
                  value="5151"
                  unit="家"
                />{" "}
                <IndicatorPercent title="同比" size="small" value="21.2" />
              </div>
            </div>
          </div>
          <div className="my-[17px]  flex justify-center items-center">
            <NumberBox
              title={"今日景区人数"}
              value={12323}
              titleStyle={{ fontWeight: "bold" }}
              countClass={"gap-x-[10px] mt-[10px]"}
            />
          </div>
          <div className="flex justify-between  mt-[20px]">
            <div>
              <div className="font14 pl-[15px]">景区名称</div>
              <div className="flex items-baseline justify-between  gap-[10px]">
                <TypeCount
                  title=""
                  size="small"
                  color="#12FFFC"
                  value="5151"
                  unit="家"
                />{" "}
                <IndicatorPercent title="同比" size="small" value="21.2" />
              </div>
            </div>
            <div>
              <div className="font14 pl-[15px]">景区名称</div>
              <div className="flex items-baseline justify-between  gap-[10px]">
                <TypeCount
                  title=""
                  size="small"
                  color="#12FFFC"
                  value="5151"
                  unit="家"
                />{" "}
                <IndicatorPercent title="同比" size="small" value="21.2" />
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
};
export default L_1_box;
